<template>
  <view>
    <family-page v-if="userRoleCode === 'family'" />
    <other-page v-else-if="!!userRoleCode" />
    <!-- <choose-role-popup v-model="showRolePopup" @change="onConfirmRole" /> -->
  </view>
</template>

<script>
  // import ChooseRolePopup from '@views/home/components/choose-role-popup';
  // import OtherPage from '@views/home/rolePages/other';
  // import FamilyPage from '@views/home/rolePages/family';
  import { isEmpty } from '@common/utils.js';
  import { mapGetters, mapActions, mapMutations } from 'vuex';
  import { getUserInfo, getDirect, removeDirect } from '@common/auth';
  import { qryPendingCount } from '@api/visitor';

  export default {
    name: 'home',
    data() {
      return {
        showRolePopup: false
      };
    },
    computed: {
      ...mapGetters('user', ['userInfo', 'userRoles', 'userRole', 'userTodoBadge']),
      ...mapGetters('wechat', ['isConfigSuccess']),
      userRoleCode() {
        return this.userRole.roleCode || '';
      }
    },
    watch: {
      userRole(nVal) {
        if (isEmpty(nVal)) return;
        // 切换到非家长角色，需要删除其孩子信息
        if (nVal.roleCode !== 'family') {
          const { children, curChild, ...userInfo } = this.userInfo;
          if (!isEmpty(children) || !isEmpty(curChild)) this.setUserInfo(userInfo);
        }
      }
    },
    mounted() {
      // 第一次进入，如果用户角色不为空，校验用户信息是否完整
      if (!isEmpty(this.userRole)) this.onConfirmRole();
    },
    activated() {
      this.setBodyHeight(document.body.clientHeight);
      // 用户角色
      if (isEmpty(this.userRole)) this.verifyUserRole();
      // 获取微信 sdk 所需的配置信息
      if (isEmpty(this.isConfigSuccess)) this.getWxConfig();
      // 我的待办总数（访客待审核和门禁待审核）
      if (!['visitors', 'student'].includes(this.userRole.roleCode)) {
        this.qryPendingCount();
      }
    },
	onReady() {
		console.log(this.userInfo, 'userInfo onReady')
	},
    methods: {
      ...mapMutations('user', ['setUserInfo', 'setUserRole', 'setUserTodoBadge']),
      ...mapActions('wechat', ['getWxConfig']),
      ...mapMutations('attendance', ['initCurdate', 'setBodyHeight']),
      onConfirmRole() {
        this.verifyUserInfo();
      },
      verifyUserRole() {
        const { userRoles } = this;
        if (isEmpty(userRoles)) return this.verifyUserInfo();

        // 用户只有一个角色
        if (userRoles.length === 1) {
          this.setUserRole(userRoles[0]);
          return this.onConfirmRole();
        }

        // 多角色
        this.showRolePopup = true;
      },
      verifyUserInfo() {
        // 弹窗只显示一次
        // if (getHomeIsShowRolePopup() === 'true') return false;

        const { photo, phone, userName } = this.userInfo;

        if (isEmpty(photo) || isEmpty(phone) || isEmpty(userName)) {
          // setHomeIsShowRolePopup(true);
          this.$dialog
            .alert({
              title: '个人信息不完整',
              message: '请先完善个人信息'
            })
            .then(() => this.$router.push('/user/user-info'));
        }
      },
      // 我的待办总数（访客待审核和门禁待审核）
      qryPendingCount() {
        const _self = this;
        const reqData = {
          placeUserId: getUserInfo().placeUserId
        };
        qryPendingCount(reqData).then((res) => {
          const { success, msg, data } = res;
          if (success) {
            _self.setUserTodoBadge(data);
          } else {
            _self.setUserTodoBadge({});
          }
        });
      }
    },
    beforeRouteEnter(to, from, next) {
      // 判断是否有直连
      const direct = getDirect();
      if (direct) return removeDirect() && next(direct);

      next();
    },
    beforeRouteLeave(to, from, next) {
      if (to.path === '/attendance/dorm-admin') {
        this.initCurdate();
      }
      next();
    }
  };
</script>
